.resume-generator-detail-page {
  position: relative;
  display: flex;
  flex-direction: column;

  .resume-generator-detail-page-body {
    border-top: none;
    background-color: transparent;
    flex: 1;
    overflow: hidden;
    display: flex;
    padding: 0 !important;

    .page-body-left {
      flex: 1;
      overflow: hidden;
      background-color: transparent;

      .page-body-title {
        font-size: 1.2em;
        font-weight: 600;
        color: plv(text-1);
        margin-bottom: 1em;
      }

      & > .#{componentName(scroll)} {
        background-color: transparent;
        padding: 0 !important;
      }

      .page-group-title {
        font-size: 14px;
        font-weight: 600;
        color: plv(text-1);
        margin-bottom: 1em;
      }

      .page-form-item {
        flex: 1;

        & > .#{componentName(button)} {
          position: relative;
          min-width: initial;
        }

        .page-form-item-label {
          width: 75px;
          position: relative;

          &:after {
            content: ': ';
            position: absolute;
            left: calc(100% + 0.25em);
            top: 0;
            bottom: 0;
          }
        }

        &.text-align-left {
          .page-form-item-label {
            text-align: left;
          }
        }

        &.text-align-center {
          .page-form-item-label {
            text-align: center;
            width: 22px;

            &:after {
              content: none;
            }
          }
        }

        &.text-align-right {
          .page-form-item-label {
            text-align: right
          }
        }

        &.text-align-justify {
          .page-form-item-label {
            text-align-last: justify;
          }
        }
      }

      .#{componentName(space)} {
        &.space-horizontal {
          justify-content: space-between;
        }

        & + .#{componentName(space)} {
          margin-top: 1em;
        }
      }
    }

    .page-body-right {
      margin-top: 0 !important;
      width: 820px;
      box-sizing: content-box;

      & > .#{componentName(page-card-content)} {
        background-color: white;
      }
    }
  }
}

@include comp(page-card) {
  @include sizeMixin(page-card, ()) {
    &.resume-generator-detail-page {
      .resume-generator-detail-page-body {
        margin-top: $margin;
      }

      & > .#{componentName(page-card-title)} {
        border-bottom-left-radius: $border-radius;
        border-bottom-right-radius: $border-radius;
      }

      .page-body-right {
        margin-left: $margin;
      }
    }
  }
}
